import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Route, Link, IndexRoute, Redirect,hashHistory } from 'react-router';
require('es6-promise').polyfill();
require('isomorphic-fetch');
export default class Register extends React.Component {

    constructor() {
        super()
        this.state = {
            username:"",
            password:"",
            confirmPass:"",
            useranameMessage:"",
            passwordMessage:"",
            confirmPasswordMessage:"",
            mounted:false,
        };
    }
    componentDidMount(){

        this.setState({
            mounted:true
        })
    }
    validationdData(){
        if(this.state.mounted){
            let addForm = ReactDOM.findDOMNode(this.refs.addForm);
            let usernameValue=addForm.querySelector('#username').value;
            this.setState({username:usernameValue});
            let passwordValue=addForm.querySelector('#password').value;
            this.setState({password:passwordValue});
            let confirmPassValue=addForm.querySelector('#confirmPass').value;
            this.setState({confirmPass:confirmPassValue});


<<<<<<< HEAD
=======
            if(parms ==1){
>>>>>>> 4dfdfc729b10def885a89d6893053b7d5324b8c9
                if(usernameValue==""||usernameValue==null){
                    this.setState({"useranameMessage":"用户名不能为空"});
                    return false;
                }else
                {
                    this.setState({"useranameMessage":""});
                }



                if(passwordValue==""||passwordValue==null){
                    this.setState({"passwordMessage":"密码不能为空"});
                    return false;
                }else
                {

                    var reg=new RegExp(/[A-Za-z].*[0-9]|[0-9].*[A-Za-z]/);
                    if(!(passwordValue.length>7&&passwordValue.length<12) || !(reg.test(passwordValue)) ){
                        this.setState({"passwordMessage":"密码需要8-12位，包含字母及数字"});
                        return false;
                    }else {
                        this.setState({"passwordMessage":""});
                    }


                }


                if(confirmPassValue=="" || confirmPassValue==null){
                    this.setState({"confirmPasswordMessage":"请再次输入您的密码"});
                    return false;
                }else {
                    if(!(confirmPassValue==passwordValue)){
                        this.setState({"confirmPasswordMessage":"密码两次输入不一致"});
                        return false;
                    }else {
                        this.setState({"confirmPasswordMessage":""})
                    }
                }



        }
    }

    register(){
        let flag=this.validationdData();
        alert(flag);

<<<<<<< HEAD
       if(!(flag==false)){
           let data={
               username:this.state.username,
               passwork:this.state.password,
               confirmPass:this.state.confirmPass
           }

           fetch('./src/aa.json',
               {
                   method: 'GET',
                   headers: {
                       'Accept': 'application/json',
                       "Content-Type": "application/json"
                   },
                   body: JSON.stringify(data)
               }
           )
               .then(function(response) {
                   return response.json();
               }).then(function(json) {
               console.log(json);
               /*  console.log('parsed json', json)*/
           }).catch(function(ex) {
               console.log('parsing failed', ex)

           })
       }
=======

        if(this.state.flag){
            let data={
                username:this.state.username,
                passwork:this.state.password,
                confirmPass:this.state.confirmPass
            }

            fetch('/src/aa.json',
                {
                    method: 'post',
                    headers: {
                        'Accept': 'application/json',
                        "Content-Type": "application/json"
                    },
                    body: JSON.stringify(data)
                }
            )
                .then(function(response) {
                    return response.json();
                }).then(function(json) {
                console.log(json);
                /*  console.log('parsed json', json)*/
            }).catch(function(ex) {
                console.log('parsing failed', ex)

            })
        }

>>>>>>> 4dfdfc729b10def885a89d6893053b7d5324b8c9

    }

    render(){
        return (
            <div className="">

                <div className="loginInput-w">
                    <div ref="addForm"  className="loginInput">
                        <input className="input" id="username" type="text" placeholder="用户名" onChange={this.validationdData.bind(this)}/>
                        <div className="tip">{this.state.useranameMessage}</div>
                        <input className="input" type="password" id="password" placeholder="密码" onChange={this.validationdData.bind(this)}/>
                        <div className="tip">{this.state.passwordMessage}</div>
                        <input className="input" type="password" id="confirmPass" placeholder="确认密码" onChange={this.validationdData.bind(this)}/>
                        <div className="tip">{this.state.confirmPasswordMessage}</div>
                        <button className="input login" onClick={this.register.bind(this)}>注册</button>
                        <button className="input register"><Link to="/login" style={{color:"#3970d7",textDecoration:"none"}}>已注册，去登录</Link></button>
                    </div>
                </div>

            </div>
        );
    }
}